<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>用户管理页面</title>
</head>
<body>
    <form method="POST" action="/user/create">
        <h3>姓名:<input type="text" name="name" autocomplete="off"></h3>
        <h3>年龄:<input type="number" name="age" autocomplete="off"></h3>
        <h3>性别:<input type="radio" name="gender" value="男">男<input type="radio" name="gender" value="女">女</h3>
        <h3><div><img src="<?php echo captcha_src() ?>" alt="" onclick='this.src="/captcha.html?"+Math.random();'></div></h3>
        <h3>验证码:<input type="text" name="code" autocomplete="off"></h3>
        <h3><input type="submit" name="sumbit" value="提交"></h3>
    </form>
    <br>
    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>姓名</th>
                <th>年龄</th>
                <th>性别</th>
                <th colspan="2">操作</th>
            </tr>
        </thead>
        <tbody>
            <?php
            foreach ($users as $user) {
                ?>
                <tr>
                    <td><?=$user['id']?></td>
                    <td><?=$user['name']?></td>
                    <td><?=$user['age']?></td>
                    <td><?=$user['gender']?></td>
                    <td><a href="/user/show?id=<?=$user['id']?>">详情</a></td>
                    <td><a onclick="return confirm('是否删除')" href="/user/delete?id=<?=$user['id']?>">删除</a></td>
                </tr>
            <?php
            }
            ?>

        </tbody>
    </table>

</body>
</html>

<style>
    table{
    width: 100%;
    border-collapse: collapse;
    }

    table caption{
    font-size: 2em;
    font-weight: bold;
    margin: 1em 0;
    }

    th,td{
    border: 1px solid #999;
    text-align: center;
    padding: 20px 0;
    }

    table thead tr{
    background-color: #008c8c;
    color: #fff;
    }

    table tbody tr:nth-child(odd){
    background-color: #eee;
    }

    table tbody tr:hover{
    background-color: #ccc;
    }

    table tbody tr td:first-child{
    color: #f40;
    }

    table tfoot tr td{
    text-align: right;
    padding-right: 20px;
    }
</style>
